<template>
<view class="container">
  <mvBar :mysNavConfig="mysNavConfig"></mvBar>
  <view class="form-panel">
    <view class="invoice-form">
      <view class="invoice-form-item mt-20">
        <view class="invoice-form-label">公司地址</view>
        <view class="invoice-form-val val-text">
          <uni-easyinput type="textarea" :inputBorder="false"  autoHeight v-model="formData.buyerAddress" placeholder="请输入内容" :maxlength="49"></uni-easyinput>
        </view>
      </view>
      <view class="invoice-form-item flex-between">
        <view class="invoice-form-label">公司电话</view>
        <view class="invoice-form-val val-text">
          <uni-easyinput v-model="formData.buyerTel" :inputBorder="false" placeholder="请输入公司电话" placeholderStyle="text-align:right" ></uni-easyinput>
        </view>
      </view>
      <view class="invoice-form-item mt-20">
        <view class="invoice-form-label">公司开户行</view>
        <view class="invoice-form-val val-text">
          <uni-easyinput type="textarea" :inputBorder="false"  autoHeight v-model="formData.buyerBankName" placeholder="请输入公司开户行" :maxlength="49"></uni-easyinput>
        </view>
      </view>
      <view class="invoice-form-item flex-between">
        <view class="invoice-form-label">开户行账号</view>
        <view class="invoice-form-val val-text">
          <uni-easyinput v-model="formData.buyerBankAccount" :inputBorder="false" placeholder="请输入开户行账号" placeholderStyle="text-align:right" ></uni-easyinput>
        </view>
      </view>
<!--      <view class="invoice-form-item mt-20">-->
<!--        <view class="invoice-form-label">备注</view>-->
<!--        <view class="invoice-form-val val-text">-->
<!--          <uni-easyinput type="textarea" :inputBorder="false"  autoHeight v-model="formData.remark" placeholder="按企业报销要求填写(该内容会打印在发票上）" :maxlength="80"></uni-easyinput>-->
<!--        </view>-->
<!--      </view>-->
    </view>
  </view>
  <view class="confirm-btn" @click="onConfirm">确定</view>
</view>
</template>

<script>

import mvBar from "@/components/mysNavBar.vue";
export default {
  name: "index",
  components: {mvBar},
  data(){
    return{
      mysNavConfig: {
        navPadding: true,
        isHome: false,
        navFixed: true,
        navTitle: {
          text: "更多内容",
          color: "#1B1B1B",
          fontSize: "34upx", // px upx rpx
          fontWeight: "500", // blod
        },
        leftIconPath: '/static/header/back-b.png'
      },
      formData:{
        buyerAddress: "",
        buyerBankAccount: "",
        buyerBankName: "",
        buyerTel: "",
        remark: ''
      }
    }
  },
  onLoad(){
    const d = uni.getStorageSync('moreInfo') || ''
    if (d !== ''){
      this.formData = d
    }
  },
  methods:{
    onConfirm(){
      uni.$emit('invoiceMoreInfo',{msg:this.formData})
      uni.navigateBack(0)
    },
  }
}
</script>

<style lang="scss" scoped>
.container{
  background: #F7F7F7;
  padding-bottom: 160upx;
  ::v-deep{
    .uni-easyinput__placeholder-class{
      font-size: 28upx;
    }
  }
  .mt-20{
    margin-top: 20upx;
  }
  .confirm-btn{
    position: fixed;
    left: 50%;
    bottom: 80upx;
    width: 700upx;
    line-height: 80upx;
    background: #006241;
    border-radius: 60upx;
    color: #FFFFFF;
    text-align: center;
    transform: translateX(-50%);
  }
  .form-panel{
    .title{
      padding: 24upx;
      font-size: 28upx;
      color: #9D9D9D;
    }
    .invoice-form{
      .flex-between{
        display: flex;
        justify-content: space-between;
        align-items: center;
      }
      .invoice-form-item {
        box-sizing: border-box;
        padding: 32upx 24upx;
        background: #FFFFFF;
        box-shadow: 0px -0.5px 0px 0px #0000001A inset;
        font-size: 32upx;
        font-weight: 400;
        .invoice-form-label{
          min-width: 200upx;
          color: #1B1B1B;
        }
        .invoice-form-val{
          width: 100%;
          font-size: 28upx;
          display: flex;
          align-items: center;
          justify-content: flex-end;
          label{
            margin-left: 16upx;
          }
          .icon{
            margin-left: 12upx;
          }
        }
        .val-text{
          font-size: 34upx;
          //color: #9D9D9D;
        }
        .total-price{
          width: 100%;
          justify-content: space-between;
          .price{
            color: #1B1B1B;
            text{
              margin-right: 12upx;
              color: #F57546;
            }
          }
        }
      }
    }
  }
}
</style>